<template>
  <div>
<div class="box">
    <div class="yi">
      <input type="text" placeholder="OPPO A3"> <button>登录</button>
    </div>
    <div class="er">
      <img src="./img/1.jpg" alt="">
    </div>
    <div class="san">
      <dl>
        <dt><img src="./img/2.jpg" alt=""></dt>
        <dd>手机</dd>
      </dl>
      <dl>
        <dt><img src="./img/2.jpg" alt=""></dt>
        <dd>手机</dd>
      </dl>
      <dl>
        <dt><img src="./img/2.jpg" alt=""></dt>
        <dd>手机</dd>
      </dl>
      <dl>
        <dt><img src="./img/2.jpg" alt=""></dt>
        <dd>手机</dd>
      </dl>
      <dl>
        <dt><img src="./img/2.jpg" alt=""></dt>
        <dd>手机</dd>
      </dl>
    </div>
    <div class="si">
      <img src="./img/3.jpg" alt="">
    </div>
    <div class="wu">
      <dl>
        <dt><img src="./img/4.jpg" alt=""></dt>
        <dd>首页</dd>
      </dl>
      <dl>
        <dt><img src="./img/4.jpg" alt=""></dt>
        <dd>首页</dd>
      </dl>
      <dl>
        <dt><img src="./img/4.jpg" alt=""></dt>
        <dd>首页</dd>
      </dl>
      <dl>
        <dt><img src="./img/4.jpg" alt=""></dt>
        <dd>首页</dd>
      </dl>
    </div>
  </div>
  </div>
</template>

<style>
.box{
   margin: 0;
   padding: 0;
   list-style: none;
}
.yi{
  float: left;
}
.er{
  margin: 0 auto;
}
.san dl{
  float: left;
}
.si{
  margin: 0 auto;
}
.wu dl{
  float: left;
}
</style>